<template>
  <section class="modlude">
    <!-- <el-form :inline="true" :model="formSearch" class="form_inline" label-width="80px">
      <el-form-item label="选择区域" size="small">
        <el-select v-model="formSearch.xqId" placeholder="请选择区域">
          <el-option v-for="(item,index) in xqTree" :label="item.name" :value="item.id" :key="index"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="开始时间">
        <el-date-picker
          v-model="formSearch.startTime"
          clearable
          type="datetime"
          value-format="timestamp"
          placeholder="选择开始时间">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="结束时间">
        <el-date-picker
          clearable
          v-model="formSearch.endTime"
          type="datetime"
          value-format="timestamp"
          placeholder="选择开始时间">
        </el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button @click="getlist">查 询</el-button>
      </el-form-item>
    </el-form> -->
    <el-table :data="formData" style="width: 100%" stripe>
      <el-table-column prop="areaName" label="区域名"></el-table-column>
       <el-table-column prop="deviceName" label="设备名称"></el-table-column>
      <el-table-column prop="doorName" label="开名称"></el-table-column>
       <el-table-column prop="acsEventName" label="开门事件"></el-table-column>
      <el-table-column prop="userName" label="用户名"></el-table-column>
       <el-table-column prop="userOrgName" label="用户组织"></el-table-column>
      <el-table-column label="刷卡事件">
        <template slot-scope="scope">
					{{scope.row.isSwipeCard?"是":"不是"}}
				</template>
      </el-table-column>
        <el-table-column label="开门时间" prop="gmtSwipeCardTime"> </el-table-column>
        <el-table-column label="出入标记">
        <template slot-scope="scope">
					{{scope.row.inOrOut?"进":"出"}}
				</template>
      </el-table-column>
        <el-table-column label="状态">
        <template slot-scope="scope">
					{{scope.row.cardState==0?"挂失":"正常"}}
				</template>
      </el-table-column>
    </el-table>
    <paging @changePage = 'handleCurrentPage' :get-total='total'></paging>

    </section>
</template>

<script>
import paging from '../../components/paging'
import { getAkxDoorRecords,openHwDev,xqSelectList,orgTree } from '../../url/api';

export default {
  data(){
    return{
      option1:[],
      xqTree:[],
      isAddorUpdate:1,//1添加、2修改
      formSearch:{
        xqId:""
      },
      formData:[],//数据
      formUpdate:{},//修改表单
      total: 0,//数据总数
      dataTree:[],
      defaultProps2: {
        children: 'children',
        label: 'name',
        value: 'id',
        expandTrigger: 'hover',checkStrictly: true
      },
    }
  },
  created(){

    this.Bus.$on('sendTableData1',(data)=>{
        console.log('~~~~',data);
        this.formSearch = data.formSearch;
        // this.total = data.total
        this.getlist();
      })
  },
  methods:{

    getlist(){
      getAkxDoorRecords(this.formSearch).then((res)=>{
        console.log(res)
        if(res.data.ok){
          this.formData = res.data.data.records
          this.total = res.data.data.total
        }else{
          this.$message.error(res.data.msg);
        }
      })
    },
    getInit(){//初始化列表

      xqSelectList({}).then((res)=>{//区域选择列表
        console.log(res)
        if(res.data.ok){
          this.xqTree = res.data.data
          this.formSearch.xqId= this.xqTree[0].id
          this.getlist()
        }
      })
      let org_tree={
        name:'',
        status:1
      }
      orgTree(org_tree).then((res)=>{//获取组织列表
        console.log(res)
        if(res.data.ok){
          this.dataTree = res.data.data
        }
      })
    },
    deleInfor(obj){//远程开门
      let params = {
        id:obj.id,
        name:obj.name,
        account:localStorage.getItem('phone')
      }
      openHwDev(params).then((res)=>{
        console.log(res)
        if(res.data.ok){
          this.$message({
            message: '远程开门成功',
            type: 'success'
          });
        }
      })
    },
    handleCurrentPage(val){//页码改变
      this.formSearch.current=val
      this.getlist()
    },
    handleChange(value){
      if(value.length!=0){
        console.log(value)
        this.formSearch.orgId=this.$refs.cascader.getCheckedNodes()[0].data.id
      }else{
        this.formSearch.orgId = ''
      }
      getAkxDoorRecords(this.formSearch).then((res)=>{
        console.log(res)
        if(res.data.ok){
          this.formData = res.data.data.records
          this.total = res.data.data.total
        }else{
          this.$message(res.data.msg);
        }
      })
    }
  },
  mounted(){
    // this.getInit();
    // this.getTableData();

  },
  components:{
    paging,
  }
}
</script>
<style scoped>
.form_inline{
  margin: 10px 10px 0;
}
.form_inline  .el-date-editor--datetime,.el-date-editor.el-input, .el-date-editor.el-input__inner{
  width: 100%;
}

  .cont_box{
    width:100%;
    display: flex;
  }
  .cont_box_left,.cont_box_right{
    flex:1;
    background: transparent ;
    padding:10px;
  }
  .cont_box_left{
    margin-right:10px;
  }
  .margin10{
    margin-bottom:10px;
  }
  .marginRight{
    margin-bottom:10px;
    border-bottom: 1px solid #eee;
  }
  .cont_box_right .el-form-item{
    margin-bottom:20px;
  }

</style>
